<% provide :tab_tile, "Home" %>
<% provide :main_title, "Code: 1-bit" %>
<% provide :css_file, "application" %>
<style type="text/css">

  .jumbotron {
    background-image: url('../images/home-screen-background-image.png');
    background-repeat: no-repeat;
    background-size:100% 100%;
  }
  @@media (max-width: 480px) {
    .screen-content {
      margin: 10px 10px;
      color: white;
    }
    .thumbnail {
      min-height: 465px;
      max-height: 500px;
    }
    .second {
      margin: 1%;
    }
  }
  @@media (max-width: 1024px) {
    .screen-content {
      margin: 80px 80px;
      color: white;
    }
    .thumbnail {
      min-height: 250px;
      max-height: 280px;
    }
    .second {
      margin: 80px 80px;
    }
  }

  .second-title {
    text-align: center;
  }
</style>

<%= render 'header' %>



<div class="body-content">
  <!-- big screen -->
  <div class="jumbotron">
    <div class="screen-content">
      <h1>欢迎</h1>
      <p>为你提供更多实用的简历模板。</p>
      <p><a class="btn btn-success btn-lg" href="#" role="button">立即注册</a> <a class="btn btn-primary btn-lg" href="#" role="button">登录</a></p>
    </div>
  </div>

  <div class="second">
    <div class="page-header second-title">
      <h1 class="text-primary">Free Sample</h1>
    </div>
    <div class="row">
      <div class="col-xs-6 col-md-3">
        <div class="thumbnail">
          <a href="#">
            <img src="https://tse1.mm.bing.net/th?&id=OIP.M9dbca63915d4349ac58f9172c0ef4ab2o0&w=300&h=300&c=0&pid=1.9&rs=0&p=0&r=0">
          </a>
          <div class="caption">
            <h3>Gray Style</h3>
            <p>简约、充实、一目了然，适合技术类岗位。</p>
            <p><a href="#" class="btn btn-primary" role="button">下载</a> <a href="#" class="btn btn-default" role="button">预览</a></p>
          </div>
        </div>
      </div>
      <div class="col-xs-6 col-md-3">
        <div class="thumbnail">
          <a href="#">
            <img src="https://tse1.mm.bing.net/th?&id=OIP.M9dbca63915d4349ac58f9172c0ef4ab2o0&w=300&h=300&c=0&pid=1.9&rs=0&p=0&r=0" alt="...">
          </a>
          <div class="caption">
            <h3>hello world</h3>
            <p>简约、充实、一目了然，适合技术类岗位。</p>
            <p><a href="#" class="btn btn-primary" role="button">下载</a> <a href="#" class="btn btn-default" role="button">预览</a></p>
          </div>
        </div>
      </div>
      <div class="col-xs-6 col-md-3">
        <div class="thumbnail">
          <a href="#">
            <img src="https://tse1.mm.bing.net/th?&id=OIP.M9dbca63915d4349ac58f9172c0ef4ab2o0&w=300&h=300&c=0&pid=1.9&rs=0&p=0&r=0" alt="...">
          </a>
          <div class="caption">
            <h3>Thumbnail label</h3>
            <p>...</p>
            <p><a href="#" class="btn btn-primary" role="button">下载</a> <a href="#" class="btn btn-default" role="button">预览</a></p>
          </div>
        </div>
      </div>
      <div class="col-xs-6 col-md-3">
        <div class="thumbnail">
          <a href="#">
            <img src="https://tse1.mm.bing.net/th?&id=OIP.M9dbca63915d4349ac58f9172c0ef4ab2o0&w=300&h=300&c=0&pid=1.9&rs=0&p=0&r=0" alt="...">
          </a>
          <div class="caption">
            <h3>Thumbnail label</h3>
            <p>...</p>
            <p><a href="#" class="btn btn-primary" role="button">下载</a> <a href="#" class="btn btn-default" role="button">预览</a></p>
          </div>
        </div>
      </div>

      <div class="col-xs-6 col-md-3">
        <div class="thumbnail">
          <a href="#">
            <img src="https://tse1.mm.bing.net/th?&id=OIP.M9dbca63915d4349ac58f9172c0ef4ab2o0&w=300&h=300&c=0&pid=1.9&rs=0&p=0&r=0" alt="...">
          </a>
          <div class="caption">
            <h3>Thumbnail label</h3>
            <p>...</p>
            <p><a href="#" class="btn btn-primary" role="button">下载</a> <a href="#" class="btn btn-default" role="button">预览</a></p>
          </div>
        </div>
      </div>

      <div class="col-xs-6 col-md-3">
        <div class="thumbnail">
          <a href="#">
            <img src="https://tse1.mm.bing.net/th?&id=OIP.M9dbca63915d4349ac58f9172c0ef4ab2o0&w=300&h=300&c=0&pid=1.9&rs=0&p=0&r=0" alt="...">
          </a>
          <div class="caption">
            <h3>Thumbnail label</h3>
            <p>...</p>
            <p><a href="#" class="btn btn-primary" role="button">下载</a> <a href="#" class="btn btn-default" role="button">预览</a></p>
          </div>
        </div>
      </div>

      <div class="col-xs-6 col-md-3">
        <div class="thumbnail">
          <a href="#">
            <img src="https://tse1.mm.bing.net/th?&id=OIP.M9dbca63915d4349ac58f9172c0ef4ab2o0&w=300&h=300&c=0&pid=1.9&rs=0&p=0&r=0" alt="...">
          </a>
          <div class="caption">
            <h3>Thumbnail label</h3>
            <p>...</p>
            <p><a href="#" class="btn btn-primary" role="button">下载</a> <a href="#" class="btn btn-default" role="button">预览</a></p>
          </div>
        </div>
      </div>

      <div class="col-xs-6 col-md-3">
        <div class="thumbnail">
          <a href="#">
            <img src="https://tse1.mm.bing.net/th?&id=OIP.M9dbca63915d4349ac58f9172c0ef4ab2o0&w=300&h=300&c=0&pid=1.9&rs=0&p=0&r=0" alt="...">
          </a>
          <div class="caption">
            <h3>Thumbnail label</h3>
            <p>...</p>
            <p><a href="#" class="btn btn-primary" role="button">下载</a> <a href="#" class="btn btn-default" role="button">预览</a></p>
          </div>
        </div>
      </div>

    </div>
  </div>
</div>


<%= render 'footer' %>
